<template xmlns:v-lazy="http://www.w3.org/1999/xhtml">
  <div class="admin-server-oss">
    <w-images
      :prefix="prefix"
      url-p="pcWebListUrl"
      :search-bar="searchBar"
      bucket="ybweb">
      <el-radio-group
        size="mini"
        v-model="dataType">
        <el-radio-button
          label="旧数据"/>
        <el-radio-button
          label="新数据"/>
      </el-radio-group>
    </w-images>
  </div>
</template>

<script>
  import WImages from '../../com/images/index'
  export default {
    name: 'AdminServerOss',
    components: {
      WImages
    },
    data() {
      return {
        /**
         * 数据类型
         */
        dataType: '新数据'
      }
    },
    computed: {
      /**
       * 查找的前缀
       */
      prefix() {
        return this.dataType === '新数据' ? 'images/OSS_web' : 'images/OSS_153'
      },
      /**
       * 是否显示收索框
       */
      searchBar() {
        return this.dataType === '新数据'
      }
    }
  }
</script>

<style lang="scss" scoped>
  .admin-server-oss {
    .sel-btns {
      display: flex;
      width: 150px;
      border-radius: 4px;
      overflow: hidden;
      float: left;
      .btn {
        flex: 1 0 auto;
        text-align: center;
        line-height: 28px;
        font-size: 14px;
        background-color: #eee;
        color: #999;
      }
      .btn.action {
        background-color: #3589fe;
        color: #fff;
      }
    }
  }
</style>
